
<!--修改弹出框-->
<div class="wizard" id="wizard-edit">
    <form method="post">
        <h1>修改基表型号</h1>
        <div class="wizard-card" data-onValidated="setServerName" data-cardname="name">
            <h3 class="text-center"><span>修改基表型号</span></h3>
            <input type="hidden" name="meter_id_edit" value="">
            <div class="wizard-input-section">
                <div class="form-group">
                    <label>基表型号 <span>*</span>
                    </label>
                    <div>
                        <input type="text" id="meter_type" name="meter_type" required="required" class="form-control col-md-7 col-xs-7">
                    </div>
                </div>
            </div>
            <div class="wizard-input-section">
                <div class="form-group">
                    <label>分类 </label><span>*</span>
                    <input type="text" name="pid" id="makeedit" class="form-control col-md-7 col-xs-7" onfocus="editfocus(this)" oninput=editinput(this);"/>
                    <select id="typeedit" class="form-control" style="display: none;" onchange="changeEdit(this)">
                        <option value=""></option>
                        <option value="主类">主类</option>
                        {volist name='meterTypes' id='v'}
                        <option value="{$v['meter_type']}">{$v.meter_type}</option>
                        {/volist}
                    </select>
                </div>
            </div>

        </div>

    </form>
</div>
<!--修改弹出框-->
<script src="__JS__/jquery.js"></script>
<script>
    /*可编辑option*/
    var editArr=[];//存储option

    $(function(){
        /*先将数据存入数组*/
        $("#typeedit option").each(function(index, el) {
            editArr[index] = $(this).text();
        });
        $(document).bind('click', function(e) {
            var e = e || window.event; //浏览器兼容性
            var elem = e.target || e.srcElement;
            while (elem) { //循环判断至跟节点，防止点击的是div子元素
                if (elem.id && (elem.id == 'typenum' || elem.id == "makeedit")) {
                    return;
                }
                elem = elem.parentNode;
            }
            $('#typeedit').css('display', 'none'); //点击的不是div或其子元素
        });
    })
    //console.log(editArr)

    function changeEdit(this_) {
        $(this_).prev("input").val($(this_).find("option:selected").text());
        $("#typeedit").css({"display":"none"});
    }
    function editfocus(this_){
        $("#typeedit").css({"display":""});
        var len = editArr.length
        $("#typeedit").attr('size', len)
        var select = $("#typeedit");
        /*for(i=0;i<len;i++){
            var option = $("<option></option>").text(editArr[i]);
            select.append(option);
        }*/
    }

    function editinput(this_){
        var select = $("#typeedit");
        select.html("");
        for(i=0;i<editArr.length;i++){
            //若找到以txt的内容开头的，添option
            if(editArr[i].substring(0,this_.value.length).indexOf(this_.value)==0){
                var option = $("<option></option>").text(editArr[i]);
                select.append(option);
            }
        }
    }
</script>
